<section class="header clearfix">
  <h1 class="pull-left">{{t (concat "monitoringPage." level ".title")}}</h1>
  <div class="pull-right">
    {{#if (eq selected "prometheus")}}
      <div class="btn-group no-inline-space">
        <button class="btn btn-link btn-sm bg-default" {{action "changeSelected" "none"}}>{{t "generic.disable"}}</button>
        <button class="btn btn-link btn-sm bg-success">{{t "generic.enabled"}}</button>
      </div>
    {{else}}
      <div class="btn-group no-inline-space">
        <button class="btn btn-link btn-sm bg-primary">{{t "generic.disabled"}}</button>
        <button class="btn btn-link btn-sm bg-defualt" {{action "changeSelected" "prometheus"}}>{{t "generic.enable"}}</button>
      </div>
    {{/if}}
  </div>
</section>

{{#if (and (eq selected "prometheus") scope.currentProject.enableProjectMonitoring (not scope.currentCluster.enableClusterMonitoring))}}
  {{#banner-message color="bg-warning"}}
    <p>
      {{t "monitoringPage.clusterNotEnabled"}}
    </p>
  {{/banner-message}}
{{/if}}

{{#banner-message color="bg-info"}}
  <p>
    {{#if (eq selected "none")}}
      {{#if enabled}}
        {{t (concat "monitoringPage." level ".toDisable")}}
      {{else}}
        {{t (concat "monitoringPage." level ".disabled")}}
      {{/if}}
    {{else if (eq selected "prometheus")}}
      {{t (if enabled (concat "monitoringPage.toUpdate." level) "monitoringPage.prometheus")}}
    {{/if}}
  </p>
{{/banner-message}}

{{#if (and (eq selected "prometheus") (not loading))}}
  <div class="box mb-10">
    <div class="row">
      <div class="col span-6">
        <label class="acc-label">{{t "monitoringPage.config.retention.label"}}</label>
        <div class="input-group">
          {{input-integer min=0 value=retention}}
          <span class="input-group-addon bg-default">{{t "generic.hours"}}</span>
        </div>
      </div>
      {{#if (eq level "cluster")}}
        <div class="col span-6">
          <label class="acc-label">{{t "monitoringPage.config.nodeexporter.enable"}}</label>
          {{schema/input-boolean value=enableNodeExporter}}
        </div>
      {{/if}}
    </div>

    <div class="row">
      <div class="col span-6">
        <label class="acc-label">{{t "monitoringPage.config.prometheus.enablePersistence.label"}}</label>
        {{schema/input-boolean value=enablePrometheusPersistence}}
      </div>
      <div class="col span-6">
        <label class="acc-label">{{t "monitoringPage.config.grafana.enablePersistence.label"}}</label>
        {{schema/input-boolean value=enableGrafanaPersistence}}
      </div>
    </div>
    {{#if (and (eq level "cluster") enableNodeExporter)}}
      <div class="row">
        <div class="col span-6">
          <label class="acc-label">{{t "monitoringPage.config.nodeexporter.label"}}</label>
          {{input-integer min=1 max=65535 value=port}}
        </div>
      </div>
    {{/if}}
    {{#if enablePrometheusPersistence}}
      <div class="row">
        <div class="col span-6">
          <label class="acc-label">{{t "monitoringPage.config.prometheus.size.label"}}</label>
          {{schema/input-string value=prometheusPersistenceSize placeholder=(t "monitoringPage.config.prometheus.size.placeholder")}}
        </div>
        <div class="col span-6">
          <label class="acc-label">{{t "monitoringPage.config.prometheus.storageClass.label"}}</label>
          {{schema/input-storageclass value=prometheusStorageClass}}
        </div>
      </div>
    {{/if}}

    {{#if enableGrafanaPersistence}}
      <div class="row">
        <div class="col span-6">
          <label class="acc-label">{{t "monitoringPage.config.grafana.size.label"}}</label>
          {{schema/input-string value=grafanaPersistenceSize placeholder=(t "monitoringPage.config.grafana.size.placeholder")}}
        </div>
        <div class="col span-6">
          <label class="acc-label">{{t "monitoringPage.config.grafana.storageClass.label"}}</label>
          {{schema/input-storageclass value=grafanaStorageClass}}
        </div>
      </div>
    {{/if}}

    <div class="row">
      <div class="col span-12">
        <label class="acc-label">{{t "monitoringPage.nodeSelector.helpText"}}</label>
        {{form-key-value
            changedArray=(action (mut nodeSelectors))
            initialStr=nodeSelectorsStr
            allowEmptyValue=true
            addActionLabel="monitoringPage.nodeSelector.addSelectorLabel"
        }}
      </div>
    </div>
  </div>
{{else if loading}}
  <section class="row">
    <div class="text-center">
      <i class="icon icon-spinner icon-spin icon-3x"></i>
    </div>
  </section>
{{/if}}

<div class="text-center">
  {{save-cancel
      saveDisabled=saveDisabled
      cancelDisabled=true
      editing=(and enabled (eq selected "prometheus") )
      createLabel="saveCancel.edit"
      save="save"
  }}
</div>